<template>
    <div class="app-container">
        <div class="chart-wrapper">
            <div>
                <InspectionCenterStateChart/>
            </div>
            <div>
                <InspectionCenterTrendChart/>
            </div>
        </div>
    </div>
</template>

<script setup>
import InspectionCenterStateChart from "@/views/StatisticAnalysis/XCTotal/components/InspectionCenterStateChart.vue";
import InspectionCenterTrendChart from "@/views/StatisticAnalysis/XCTotal/components/InspectionCenterTrendChart.vue";
</script>

<style scoped lang="scss">
.app-container {
    height: 100%;
}

.chart-wrapper {
    display: grid; /* 使用网格布局 */
    grid-template-rows: 1fr 1fr; /* 将网格分为两行，每行占据相等的空间 */
    // 高度：顶部导航高度 + app-container padding 距离 + 底部广告脱离距离
    height: calc(100vh - (85px + 40px + 30px));
    gap: 20px;

    > div {
        position: relative;
        overflow: hidden;
    }
}
</style>